<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="renderer" content="webkit">
    <title>网站信息</title>
    <link rel="stylesheet" href="__CSS__/pintuer.css">
    <link rel="stylesheet" href="__CSS__/admin.css">
    <link rel="stylesheet" href="__STATIC__/css/layui.css">
    <script src="__STATIC__/layui.js"></script>
    <script src="__JS__/jquery.js"></script>
    <script src="__JS__/pintuer.js"></script>
</head>
<style>
    .bodys {
        font-size: large;
        color: #666;
    }

    .div {
        text-align: center;
        width: 1080px;
        margin: auto;
        padding-bottom: 30px;
    }

    table {
        border-collapse: collapse;
        width: 1080px
    }

    .spans {
        color: #000000;
        font-family: 黑体
    }

    .test_a {
        border: 1px solid black;
        width: 20%;
        vertical-align: middle;
        text-align: center;
        padding: 1px;
    }

    .test_b {
        border: 1px solid black;
        width: 70%;
        vertical-align: middle;
        text-align: left;
        padding: 20px
    }
</style>
<body class="bodys panel admin-panel">
<div class="panel-head"><strong><span class="icon-pencil-square-o"></span>角色信息</strong>&emsp;<a style="color: #3a4bfb;font-weight: bold " href="javascript:history.go(-1)">返回上一步</a></div>
<div class="div">
    <form class="layui-form" action="{:url('Role/rolesave_sub')}" method="post">
        <div class="layui-form-item">
            <label class="layui-form-label">角色</label>
            <div style="margin-top: 10px" class="layui-input-block">
                <input name="role" id="role" type="text" class="layui-input" required lay-verify="required" name="role" value="{$role.role}">
            </div>
        </div>
        <input type="hidden" name="id" value="{$role.id}">
        <div  class="layui-form-item layui-form-text">
            <label class="layui-form-label">描述</label>
            <div class="layui-input-block">
                <textarea  class="layui-textarea" name="descript">{$role.descript}</textarea>
            </div>
        </div>
        <div id="div_a">
            <table id="table">
                {foreach name="jurisdiction" id="vo"}
                <tr>
                    <td class="test_a">
                        <div  class="layui-form-item">
                            <div id="iii" style="text-align: center" class="layui-input-block">
                                {if condition="$vo.state eq 1"}
                                <input onclick='selectAlls("{$vo.id}")' checked="checked" class="{$vo.id}" name="{$vo.id}" id="{$vo.id}"
                                       type="checkbox" title="{$vo.jurisdiction}" value="{$vo.id}"/>
                                {else /}
                                <input onclick='selectAlls("{$vo.id}")' class="{$vo.id}" name="{$vo.id}" id="{$vo.id}" type="checkbox"
                                       value="{$vo.id}" title="{$vo.jurisdiction}"/>
                                {/if}
                            </div>
                        </div>

                    </td>
                    <td class="test_b">
                        <div  class="layui-form-item">
                            <div class="layui-input-block">
                                {foreach name="vo.child" id="vv"}
                                {if condition="$vv.state eq 1"}
                                <input onclick='cws("{$vo.id}")' checked="checked" value="{$vv.id}" type="checkbox" name="{$vv.id}" class="{$vo.id}"
                                       title="{$vv.jurisdiction}"/>&nbsp;&emsp;
                                {else /}
                                <input onclick='cws("{$vo.id}")' type="checkbox" value="{$vv.id}" class="{$vo.id}" name="{$vv.id}"   title="{$vv.jurisdiction}"/>&nbsp;&emsp;
                                {/if}
                                {/foreach}
                            </div>
                        </div>

                    </td>
                </tr>
                {/foreach}
            </table>
        </div>

        <div  class="layui-form-item">
            <div style="margin: auto" class="layui-input-block">
                <!--<input type="checkbox" name="like[all]" title="全选" id="qx" value="全选"/>-->
                <input style="text-align: center; margin-top: 20px"  type="submit" class="layui-btn" name="submit" value="确定修改"/>
            </div>
        </div>
</form>
</div>
<!--<table id="demo" lay-filter="test"></table>-->
</body>
<!--<script>
    layui.use('table', function(){
        var table = layui.table;

        //第一个实例
        table.render({
            elem: '#demo'
            ,height: 315
            ,url: "{:url('Role/index_a')}" //数据接口
            ,page: true //开启分页
            ,cols: [[ //表头
                {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}
                ,{field: 'role', title: '角色', width:80}
                ,{field: 'descript', title: '描述', width:80,}
            ]]
        });

    });
</script>-->
<script>
    $(function(){
        var checks = $("#iii input[type='checkbox']");
        $("#iii input[type='checkbox']").click(function(){
            var number = checks.filter(':checked').length;
            $('#number').html(number);
        });
        $("#qx").click(function(){
            if(this.checked){
                $("#one input[type='checkbox']").prop("checked",true);
                var number = checks.filter(':checked').length;
                $('#number').html(number);
            }else{
                $("#one input[type='checkbox']").prop("checked",false);
                $('#number').html(0);
            }
        })
    })
</script>
<script>
    /*function cw() {
     var checklists = document.getElementsByName("selected");
     for (var m = 0; m < checklists.length; m++) {
     if (checklists[m].checked) {
     document.getElementById("controlAll1").checked = 1
     }
     }
     }
     function selectAll() {
     var checklist = document.getElementsByName("selected");
     if (document.getElementById("controlAll1").checked) {
     for (var i = 0; i < checklist.length; i++) {
     checklist[i].checked = 1;
     }
     } else {
     for (var j = 0; j < checklist.length; j++) {
     checklist[j].checked = 0;
     }
     }
     }*/
        layui.use('form', function(){
            var form = layui.form;
            //监听提交
        });
    function cws(id) {
        //自己选择父级默认被选
        var checklists = document.getElementsByClassName(id);
        for (var m = 0; m < checklists.length; m++) {
            if (checklists[m].checked) {
                document.getElementById(id).checked = 1
            }
        }
    }

    function selectAlls(ids) {
        //选择父级自己全选
        alert(1111);
        var checklist = document.getElementsByClassName(ids);
        if (document.getElementById(ids).checked) {
            for (var i = 0; i < checklist.length; i++) {
                checklist[i].checked = 1;
            }
        } else {
            for (var j = 0; j < checklist.length; j++) {
                checklist[j].checked = 0;
            }
        }
    }

    function selecta() {
        var inp = $('#table').find('input');
        if (document.getElementById('qx').checked) {
            //全选
            for (var n = 0; n < inp.length; n++) {
                inp[n].checked = 1;
            }
        } else {
            //全不选
            for (var num = 0; num < inp.length; num++) {
                inp[num].checked = 0;
            }
        }
    }
</script>
</html>